import {observer} from 'mobx-react';
import React from 'react';
import {withRouter, Route} from 'react-router-dom';
import HoverWindow from './HoverWindow';
import * as EmSDK from '../util/emSDK';

@withRouter
@observer
class App extends React.Component {
    componentWillMount() {
        let startTime = new Date().getTime()
        const fun = () =>{
            let interval = new Date().getTime() - startTime;
            if(!!!window.em && interval<3000){
                setTimeout(()=>{
                    fun()
                },200)
            }else{
                EmSDK.verifyEmSDK();
            }
        }
        fun();
    }
    componentWillReceiveProps(nextProps, nextState) {
        const location = this.props.location || {};
        const nextLocation = nextProps.location || {};
        console.log("main-app", location, nextLocation);
        if (location.pathname !== nextLocation.pathname) {
            EmSDK.resetEmElement();
        }
    }
    componentWillUnmount(){
        EmSDK.resetEmElement();
    }
    componentDidMount() {
        window.historyRoute = this.props.history;
    }
    render() {
        const {location} = this.props;
        const pathname = location && location.pathname || "";
        let dom = [this.props.children];
        if (pathname.indexOf("/hoverWindow") > -1)
            dom.push(<Route key="hover" path={pathname} component={HoverWindow}/>);
        return dom;
    }
}

export default App;